<template>
  <div>
    <el-dialog :visible.sync="importVisible" title="导入权益码" width="436px">
      <div>
        <div style="margin-top: 20px">
          <div class="textLine">
            1、<a class="download" @click="download">下载模板</a>
            ，按格式准备需要导入的数据
          </div>
          <div class="textLine">
            2、上传需要导入的文件
            <el-upload
              ref="upload"
              :action="uploadAction"
              :auto-upload="false"
              :before-upload="beforeUpload"
              :data="uploadData"
              :headers="headers"
              :limit="1"
              :on-error="uploaderror"
              :on-exceed="onExceed"
              :on-success="uploadSuccess"
              style="margin-left: 6px"
            >
              <el-button>
                <svg-icon iconClass="upload-simple"></svg-icon>
                <span class="ml5"> 选择导入文件</span>
              </el-button>
            </el-upload>
          </div>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="importVisible = false"
        >取消
        </el-button
        >
        <el-button v-preventReClick="1000" :loading="loading" type="primary" @click="handelConfirm"
        >确定
        </el-button
        >
      </div>
    </el-dialog>
  </div>
</template>
<script>
import {getInsuranceType, getToken} from "@/utils/auth";

export default {
  name: "ImportCoupon",
  components: {},
  props: {
    // 添加标签显隐
    visible: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      uploadData: {},
      // 本地调试走代理
      // uploadAction: "/api" +
      //   window.CONFIG.services.admin +
      //   "/scrmcoincertificatebatch/intoCode",

      // 线上不走代理
      uploadAction:
        window.globalConfig.BASE_API +
        window.CONFIG.services.admin +
        "/scrmcoincertificatebatch/intoCode",


      makeLabelList: [],

      makeLabelVisible: false,
      loading: false,
      headers: {
        Authorization: 'Bearer ' + getToken(),
        insuranceType: getInsuranceType(),
      }
    };
  },
  computed: {
    importVisible: {
      get() {
        return this.visible;
      },
      set(val) {
        this.$emit("update:visible", val);
      },
    },
  },
  watch: {},
  created() {
  },
  mounted() {
  },
  methods: {
    close() {
      this.$emit("update:visible", false);
    },
    handelConfirm() {
      if (this.$refs.upload.$data.uploadFiles.length == 0) return this.$message.error("未选择要上传的文件");
      this.uploadData["InsuranceType"] = getInsuranceType()
      this.uploadData['batchNo'] = this.$route.query.batchNo
      this.$refs.upload.submit();
    },
    //下载模板
    download() {
      window.open(window.globalConfig.COUPON_TEMPLATE_IMPORT_ALL)
    },
    //文件上传成功
    uploadSuccess(res) {
      console.log(res, 'res')
      this.loading = true
      if (res.code == 200) {
        this.$emit("update:visible", false);
        this.$parent.handleQuery()
      } else {
        this.$message.error(res.msg)
        this.$refs.upload.clearFiles();
      }
      this.loading = false
    },
    //文件上传失败
    uploaderror(res) {
      console.log(res);
    },

    beforeUpload(file) {
      console.log(file.name);
      let X = file.name.split(".")[1];
      if (X != "xls" && X != "xlsx") {
        this.$message.error("文件格式不正确");
        return false;
      }
    },
    onExceed(file, fileList) {
      this.$message.error("最多只能上传一个文件");
    },
  },
}
;
</script>

<style lang="scss" scoped>
.textLine {
  margin: 12px;
  line-height: 34px;
}

.download {
  text-decoration: none;
  color: #082aff;
}
</style>
